<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript">
        window.onload=function(){
            var myImg=document.getElementById("myimg");
            var arr=["img/banner/1.jpg","img/banner/2.jpg","img/banner/3.jpg","img/banner/4.jpg"];
            var n=0;
            setInterval(function(){
                n++;
                if(n==arr.length){
                    n=0;
                }
                myImg.src=arr[n];
            },1000);
        }
    </script>

</head>
<body>
    <div class="banner">
        <img src="img/banner/1.jpg"  id="myimg">
    </div>

</body>
</html>